<script setup>
import { ref } from "vue";

import Mobile from '@/components/Mobile.vue'
import CardTable from '@/components/CardTable.vue'

import enUS from '@arco-design/web-vue/es/locale/lang/en-us';
import zhCN from '@arco-design/web-vue/es/locale/lang/zh-CN';
import zhTW from '@arco-design/web-vue/es/locale/lang/zh-TW';
const theme = ref("light");

const setTheme = () => {
  if (theme.value === "light") {
    // 设置为暗黑主题
    document.body.setAttribute("arco-theme", "dark");
  } else {
    // 恢复亮色主题
    document.body.removeAttribute("arco-theme");
  }
};
</script>

<template>
  <!-- <a-config-provider :locale="zhTW">
    <a-pagination :total="50" show-total show-jumper show-page-size />
  </a-config-provider>
  <svg xmlns="http://www.w3.org/2000/svg" width="400" height="400">
    <rect x="10" y="10" width="100" height="100" rx="12" ry="24" fill="yellow" fill-opacity="0.65" stroke="red" stroke-width="2"/>
    <circle cx="160" cy="40" r="24" fill="lime" stroke="red" stroke-width="2"/>
    <ellipse cx="260" cy="140" rx="24" ry="48" fill="lime" stroke="red" stroke-width="2"/>
    <line x1="200" y1="200" x2="400" y2="400" stroke="red" stroke-width="2" />
    <polygon points="100, 100 100, 200 300, 300" stroke="blue" stroke-width="2" fill="green"/>
    <polyline points="66,66 300,400 88,88 454,254"  stroke="lime" stroke-width="2" fill="none" />
    <text x="200" y="200" fill="black">哈哈哈</text>
    <path d="M200 0 L400 400 L200 240" fill="red"/>
  </svg> -->
  <section class="pc-main">
    <CardTable/>
<!-- <Mobile></Mobile> -->
  </section>
</template>

<style lang="scss" scoped>
@keyframes widthkey {
  from {
    width: 40px;
  }
  to {
    width: 200px;
  }
}
.pc-main {
 
}

</style>
